        /**
         * @倒计时器类
         * @Author：linwt
         * @Time:2021/10/16
         */
        class CountdownTimer {
            constructor() {
                this.showTime = document.getElementById('showTime')  //显示时间
                this.btnSart = document.getElementById('btn-start') // 开始按钮
                this.btnStop = document.getElementById('btn-stop') // 暂停按钮
                this.btnSet = document.getElementById('btn-set') // 设置确定按钮
                this.inputMin = document.getElementById('input-min') // 设置分钟输入
                this.inputSec = document.getElementById('input-sec') // 设置秒钟输入
                this.inputSec = document.getElementById('input-sec') //设置秒钟输入
                this.model = document.getElementById('model') // 模态框
                this.modelContent = this.model.getElementsByClassName('model-content')[0] //模态框的内容
                this.modelBtnClose = this.model.getElementsByClassName('btn-close')[0] // 模态框关闭的按钮
                this.min = 0 //分钟初始值 1mim
                this.sec = 59 //秒钟初始值 0s
                this.timer = null //定时器
                this.timerEn = false //定时器使能
                this.inputMin.value = this.min // 分初始值
                this.inputSec.value = this.sec // 秒初始值
                this.status = false // 记录每一轮倒计时的进行状态。true：正在某一轮倒计时；false:完成某一轮倒计时
            }
            //显示时间
            show() {
                this.showTime.innerHTML =
                    "<li>" + parseInt(this.min / 10) + parseInt(this.min % 10) + ":</li>" +
                    "<li>" + parseInt(this.sec / 10) + parseInt(this.sec % 10) + "</li>"
            }
            //初始化
            init() {
                setTimeout(() => {
                    this.showModel("欢迎使用<p style='font-size:16px'>可使用空格键 开始 或者 暂停</p>")
                }, 100)

                setTimeout(this.closeModel, 5000)

                this.show()
                this.events()
            }
            runTime() {
                if (this.timerEn) {
                    this.timer = setInterval(() => {
                        this.countOnceSecond()
                    }, 50);
                } else {

                    clearInterval(this.timer)
                }
            }
            /**
             * 精确到秒的延迟函数
             * @param handle 需要处理的事情
             * @param delay 延迟时间，默认1000毫秒
             * @returns {Function}
             * @private
             */
            delayAccurateToSecond(handle, delay = 1000) {
                // 利用闭包保存时间
                let last = +new Date()
                return (..._args) => {
                    let args = _args
                    let now = +new Date()
                    if (now - last >= delay) {
                        handle.apply(this, args)
                        last = +new Date()
                    }
                }
            }
            /**
             * 处理计数值
             */
            handleCount() {
                if (this.min < 1 && this.sec < 1) {
                    this.min = 0
                    this.sec = 0
                    this.timerEn = false
                    this.showModel("THE END!")
                    this.set()()
                    this.status = false
                } else {
                    this.status = true
                    this.sec--
                }

                if (this.sec < 0) {
                    this.sec = 59
                    this.min--
                }
            }
            /**
             * 计时器，一秒钟计数一次，执行一次
             * @returns {*}
             */
            countOnceSecond = (() => {
                return this.delayAccurateToSecond(() => {
                    this.handleCount()
                    this.show()
                })
            })()

            /**
             *
             * 检查输入的字符，必须是数字才有效
             */
            checkInputValue() {
                //处理输入的min字符，保证是合法的数字
                this.inputMin.onchange = () => {
                    if (this.inputMin.value === '' || this.inputMin.value < 0) {
                        this.inputMin.value = 0
                    }
                    this.inputMin.value = parseInt(this.inputMin.value)
                }
                //处理输入的min字符，保证是合法的数字
                this.inputSec.onchange = () => {
                    if (this.inputSec.value === '' || this.inputSec.value < 0) {
                        this.inputSec.value = 0
                    }
                    if (this.inputSec.value > 59) {
                        this.showModel('不能大于59')
                        setTimeout(this.closeModel, 1000)
                        this.inputSec.value = 59
                    }
                    this.inputSec.value = parseInt(this.inputSec.value)
                }
            }
            /**
             * 点击开始
             */
            clickStart() {
                return this.btnSart.onclick = () => {
                    if (!this.status) {
                        this.min = parseInt(this.inputMin.value)
                        this.sec = parseInt(this.inputSec.value)
                        this.show()
                    }
                    this.timerEn = true
                    this.runTime()
                }
            }
            /**
             * 点击暂停
             */
            clickStop() {
                return this.btnStop.onclick = () => {
                    this.timerEn = false
                    this.runTime()
                }
            }
            /**
             * 显示模态框
             */
            showModel(contxt) {
                this.model.style.display = 'flex'
                this.modelContent.innerHTML = contxt
            }
            /**
             * 关闭模态框
             **/
            clickCloseModel() {
                this.modelBtnClose.onclick = () => {
                    this.model.style.display = 'none'
                }
            }
            closeModel() {
                this.model.style.display = 'none'
            }
            /**
             * 键盘空格键控制开始或者暂停
             */
            onkeydown() {
                document.onkeydown = (e) => {

                    // 兼容FF和IE和Opera
                    let theEvent = window.event || e;
                    let code = theEvent.keyCode || theEvent.which || theEvent.charCode;

                    //如果摁下空格键，则允许操作开始或者暂停
                    if (code === 32) {
                        if (!this.timerEn) {
                            this.clickStart()()
                        } else {
                            this.clickStop()()
                        }
                    }
                }
            }
            /**
             *设置并且确定
             */
            set() {
                return this.btnSet.onclick = () => {
                    if (this.inputMin.value === '') {
                        this.inputMin.value = 0
                    }
                    this.timerEn = false
                    this.min = parseInt(this.inputMin.value)
                    this.sec = parseInt(this.inputSec.value)
                    this.runTime()
                    this.show()
                }
            }
            /**
             * 事件初始化
             */
            events() {
                this.checkInputValue()
                this.clickStart()
                this.clickStop()
                this.onkeydown()
                this.set()
                this.clickCloseModel()
            }
        }
        const countdownTimer = new CountdownTimer()
        countdownTimer.init()